<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <!-- <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title></title>
  <meta name="viewport" content="width=device-width, initial-scale=1"> -->
  <link href="static/assets/global/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
  <link href="static/assets/global/css/components.css" rel="stylesheet" type="text/css"/>
  <link href="static/assets/admin/pages/css/login.css" rel="stylesheet" type="text/css"/>
  <script src="static/assets/global/plugins/jquery-1.11.0.min.js" type="text/javascript"></script>
  <script src="./gethost.js" type="text/javascript"></script>
</head>

<body class="login">
<div class="content">
  <h3 class="form-title">商品详情</h3>
  <div id="promoStartDateContainer" class="form-group">
    <label style="color:blue" id="promoStatus" class="control-label">秒杀开始时间</label>
    <div>
      <label style="color:red" class="control-label" id="promoStartDate" />
    </div>
  </div>
  <div class="form-group">
    <div>
      <label class="control-label" id="title" />
    </div>
  </div>
  <div class="form-group">
    <div>
      <img style="width:200px;height:auto;" id="imgUrl">
    </div>
  </div>
  <div class="form-group">
    <label class="control-label">商品描述</label>
    <div>
      <label class="control-label" id="description" />
    </div>
  </div>
  <div id="normalPriceContainer" class="form-group">
    <label class="control-label">商品价格</label>
    <div>
      <label class="control-label" id="price" />
    </div>
  </div>
  <div id="promoPriceContainer" class="form-group">
    <label style="color:red" class="control-label">秒杀价格</label>
    <div>
      <label style="color:red" class="control-label" id="promoPrice" />
    </div>
  </div>
  <div class="form-group">
    <label class="control-label">商品库存</label>
    <div>
      <label class="control-label" id="stock" />
    </div>
  </div>
  <div class="form-group">
    <label class="control-label">商品销量</label>
    <div>
      <label class="control-label" id="sales" />
    </div>
  </div>
  <div class="form-actions">
    <button class="btn blue" id="createOrder" type="submit">
      立即购买
    </button>
  </div>

  <div id="verifyDiv" style="display:none" class="form-actions">
    <img src="">
    <input type="text" id="verifyContent" value="">
    <button class="btn blue" id="verifyButton" type="submit">
      验证
    </button>
  </div>
</div>
<input type="hidden" id="isInit" value="0"/>
</body>

<script>
  function getParam(paramName) {
    paramValue = "", isFound = !1;
    if (this.location.search.indexOf("?") == 0 && this.location.search.indexOf("=") > 1) {
      arrSource = unescape(this.location.search).substring(1, this.location.search.length).split("&"), i = 0;
      while (i < arrSource.length && !isFound)
        arrSource[i].indexOf("=") > 0 && arrSource[i].split("=")[0].toLowerCase() == paramName.toLowerCase() && (paramValue = arrSource[i].split("=")[1], isFound = !0), i++
    }
    return paramValue == "" && (paramValue = null), paramValue
  }


  var g_itemVO = {};
  function hasInit(){
    var isInit = $("#isInit").val();
    return isInit;
  }

  function setHasInit(){
    $("#isInit").val("1");
  }
  function initView(){
    var isInit = hasInit();
    if (isInit == "1"){
      return;
    }
    $.ajax({
      type: "GET",
      url: "http://"+g_host+"/item/get",
      data: {
        "id": getParam("id"),
      },
      xhrFields:{
        withCredentials:true
      },
      success: function(data) {
        if (data.status == "success") {
          g_itemVO = data.data;
          reloadDom();
          setInterval(reloadDom, 1000);
          setHasInit();
        } else {
          alert("获取信息失败，原因为" + data.data.errMsg);
        }
      },
      error: function(data) {
        alert("获取信息失败，原因为" + data.responseText);
      }
    });
  }



  jQuery(document).ready(function() {
    $("#verifyButton").on("click", function() {
      var token = window.localStorage["token"];
      $.ajax({
        type: "POST",
        url: "http://"+g_host+"/order/generatetoken?token="+token,
        contentType: "application/x-www-form-urlencoded",
        data: {
          "itemId": g_itemVO.id,
          "promoId": g_itemVO.promoId,
          "verifyCode": $("#verifyContent").val()
        },
        xhrFields:{
          withCredentials:true
        },
        success: function(data) {
          if (data.status == "success") {
            var promoToken =data.data;

            $.ajax({
              type: "POST",
              url: "http://"+g_host+"/order/createorder?token="+token,
              contentType: "application/x-www-form-urlencoded",
              data: {
                "itemId": g_itemVO.id,
                "promoId": g_itemVO.promoId,
                "amount": 1,
                "promoToken": promoToken
              },
              xhrFields:{
                withCredentials:true
              },
              success: function(data) {
                if (data.status == "success") {
                  alert("下单成功");
                  window.location.reload();
                } else {
                  alert("下单失败，原因为" + data.data.errMsg + data.data.errCode);
                  if (data.data.errCode == 20003) {
                    window.location.href="login.html";
                  }
                }
              },
              error: function(data) {
                alert("下单失败，原因为" + data.responseText);
              }
            });



          } else {
            alert("获取令牌失败，原因为" + data.data.errMsg + data.data.errCode);
            if (data.data.errCode == 20003) {
              window.location.href="login.html";
            }
          }
        },
        error: function(data) {
          alert("获取令牌失败，原因为" + data.responseText);
        }
      });
    }),


    $("#createOrder").on("click", function() {
      var token = window.localStorage["token"];
      if (token == null){
        alert("没有登陆,不能下单！");
        window.location.href = "login.html"
        return false;
      }
      $("#verifyDiv img").attr("src","http://"+g_host+"/order/generateverifycode?token="+token);
      $("#verifyDiv").show();



    });



// 获取商品详情
    initView();
  });

  function reloadDom() {
    $("#title").text(g_itemVO.title);
    $("#imgUrl").attr("src", g_itemVO.imgUrl);
    $("#description").text(g_itemVO.description);
    $("#price").text(g_itemVO.price);
    $("#stock").text(g_itemVO.stock);
    $("#sales").text(g_itemVO.sales);
    if (g_itemVO.promoStatus == 1) {
      // 秒杀活动还未开始
      console.log(g_itemVO.startDate);
      var startTime = g_itemVO.startDate.replace(new RegExp("-", "gm"), "/");
      startTime = (new Date(startTime)).getTime();
      var nowTime = Date.parse(new Date());
      var delta = (startTime - nowTime) / 1000;
      if (delta <= 0) {
        // 活动开始了
        g_itemVO.promoStatus = 2;
        reloadDom();
      }

      $("#promoStartDate").text("秒杀活动将于："+g_itemVO.startDate+" 开始售卖 倒计时："+delta+"  秒");
      $("#promoPrice").text(g_itemVO.promoPrice);
      $("#createOrder").attr("disabled", true);
    } else if (g_itemVO.promoStatus == 2) {
      // 秒杀活动进行中
      $("#promoStartDate").text("秒杀活动进行中");
      $("#promoPrice").text(g_itemVO.promoPrice);

      $("#createOrder").attr("disabled", false);
      $("#normalPriceContainer").hide();
    }
  }


</script>

</html>